<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <title>服务详情</title>
    <meta http-equiv="description" content=""/>
    <meta http-equiv="keywords" content="" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0,user-scalable=no"/>
    <link href="{{ URL::asset('front/css/bootstrap.min.css') }}" rel="stylesheet">
    <link rel="stylesheet" href="{{ URL::asset('front/fonts/font-awesome.min.css') }}">
    <script src="{{ URL::asset('front/js/jquery.min.js') }}"></script>
    <script src="{{ URL::asset('front/js/bootstrap.min.js') }}"></script>

    <link rel="stylesheet" type="text/css" href="{{ URL::asset('front/css/common.css') }}"/>
    <link rel="stylesheet" type="text/css" href="{{ URL::asset('front/css/site.css') }}"/>

</head>

<body style="backgorund:#181818;">
<div id="product_slider" class="carousel slide">
    <!-- 轮播（Carousel）指标 -->
    <ol class="carousel-indicators">
        <li data-target="#product_slider" data-slide-to="0" class="active"></li>
        <li data-target="#product_slider" data-slide-to="1"></li>
        <li data-target="#product_slider" data-slide-to="2"></li>
    </ol>
    <!-- 轮播（Carousel）项目 -->
    <div class="carousel-inner">

        <div class="item active" style="background-image:url('{{ $PATH }}{{ $machine->cover }}')"></div>

    </div>
    <!-- 轮播（Carousel）导航 -->
    <a class="carousel-control left" href="#product_slider"
       data-slide="prev">&lsaquo;</a>
    <a class="carousel-control right" href="#product_slider"
       data-slide="next">&rsaquo;</a>
</div>

<div id="product_info">
    <!-- Nav tabs -->
    <ul class="nav nav-tabs" role="tablist"   data-spy="affix" data-offset-top="236">
        <li><a href="#tedian" role="tab" data-toggle="tab"><i class="fa  fa-gift"></i> 详情</a></li>
        <li><a href="#canshu" role="tab" data-toggle="tab"><i class="fa fa-wrench"></i> 技术参数</a></li>
        <li class="active"><a href="#anzhuang" role="tab" data-toggle="tab"><i class="fa fa-thumbs-o-up"></i> 装机评价</a></li>
    </ul>

    <!-- Tab panes -->
    <div class="tab-content">
        <div class="tab-pane" id="tedian">
        	<div class="tabfont">
                <div><label>型号:</label>
                    @foreach($machines as $machinel)
                        <a href="{{ route('machines.index',array('m_id'=>$machinel->id)) }}" class="@if($machinel->id == $machine->id) btn btn-primary btn-sm  active @else btn btn-default btn-sm @endif" >{{ $machinel->name }}</a>
                    @endforeach
                 </div>
                <div><label>市场价:</label> <del>{{ $machine->price }}</del> <small>部分城市开通赠机</small></div>
                <hr class="hr_inner_dashed" />
            </div>
            <div class="maininfo">
                {{ $machine->content }}
            </div>
        </div>
        <div class="tab-pane" id="canshu">
            <ul>
                <li><img src="{{ URL::asset('front/img/canshu/canshu-1.gif') }}"><p>反渗透过滤</p></li>
                @if($machine->id == 10)
                <li><img src="{{ URL::asset('front/img/canshu/canshu-2-2.gif') }}"><p>七级过滤</p></li>
                @else
                <li><img src="{{ URL::asset('front/img/canshu/canshu-2.gif') }}"><p>五级过滤</p></li>
                @endif
                <li><img src="{{ URL::asset('front/img/canshu/canshu-3.gif') }}"><p>产品保险</p></li>
                <li><img src="{{ URL::asset('front/img/canshu/canshu-4.gif') }}"><p>去除重金属</p></li>
                <li><img src="{{ URL::asset('front/img/canshu/canshu-5.gif') }}"><p>食品级材料</p></li>
                <li><img src="{{ URL::asset('front/img/canshu/canshu-6.gif') }}"><p>智能控制</p></li>
                @if($machine->id == 10)
                <li><img src="{{ URL::asset('front/img/canshu/canshu-7-2.gif') }}"><p>双膜双水</p></li>
                @else
                <li><img src="{{ URL::asset('front/img/canshu/canshu-7.gif') }}"><p>纯净出水</p></li>
                @endif
                <li><img src="{{ URL::asset('front/img/canshu/canshu-8.gif') }}"><p>自动冲洗</p></li>
                <li><img src="{{ URL::asset('front/img/canshu/canshu-9.gif') }}"><p>0.0001微米</p></li>
            </ul>
        </div>
        <div class="tab-pane active" id="anzhuang">

        <DIV style="width:100%;">
            <IMG alt="" src="{{ $PATH }}{{ $area->cover }}" style="width:50%;">
        <UL id=myrank style="width:48%; float:right;">
          <LI><span class="pop">您当前所在位子：</span>{{ $area->cityinfo->name }}-&gt;{{ $area->fatherinfo->name }}-&gt;{{ $area->name }}
          <LI><span class="pop">平均自来水水质：</span>{{ $area->data1 }}
          <LI><span class="pop">服务网点直达社区</span>：投币售水机位于小区入口!</LI></UL>
        </DIV>
        <style>
          #myrank li span.pop{ color:#0f79c3;}
          #myrank li{ text-align: left; border-bottom: 0; font-size: 12px;}
        </style>
            <ul id="myrank">
                @foreach($rates as $rate)
                <li>
                    <div>
                    <img class="img-circle" src="{{ $rate->customer->avatar }}"/>
                    @for($i = 0;$i<$rate->form1;$i++)
                    <i class="fa fa-star"></i>
                    @endfor
                    </div>
                    <div class="clearfix"></div>
                    <p>{{ $rate->remark }}</p>
                    <p class="picshow">
                    @foreach($rate->service->mount->pictures as $picture)
                        <span style=" background-image:url('{{ $picture->path }}')"></span>
                    @endforeach
                        {{--<span style=" background-image:url(http://job.vbafang.com/ueditor/php/upload/image/20140917/1410926273142915.jpg)"></span>--}}
                        {{--<span style=" background-image:url(http://job.vbafang.com/ueditor/php/upload/image/20140917/1410926273142915.jpg)"></span>--}}
                        {{--<span style=" background-image:url(http://job.vbafang.com/ueditor/php/upload/image/20140917/1410926273142915.jpg)"></span>--}}
                    </p>
                    <div class="clearfix"></div>

                    
                    <h4><span class="pull-right">{{ $rate->created_at }}</span>{{ $rate->service->mount->xiaoqu->name }}***先生</h4>
                </li>
                @endforeach



            </ul>
        </div>
    </div>
</div>


<div class="copy">
    <div class="container">
        
    </div>
</div>

<footer class="footer">
    <div class="row">
    <div class="col-xs-6"><a href="javascript:void(0);" onclick="WeixinJSBridge.call('closeWindow');"><i class="fa fa-remove"></i> 返回</a></div>
    <div class="col-xs-6"><a href="https://open.weixin.qq.com/connect/oauth2/authorize?appid=wxc64f995bebe39161&redirect_uri=http%3a%2f%2fcrm.leaderphos.com%2fdiscern&response_type=code&scope=snsapi_userinfo&state=request#wechat_redirect"><i class="fa fa-gift"></i> 立即申请</a></div>
    </div>
</footer>

    <script src="{{ URL::asset('front/js/jquery.min.js') }}"></script>
<script type="text/javascript">
    $(function(){
        $("#brand_menu").click(function(){
            $("#k_list").toggle();
        })
    });
</script>
<script type="text/javascript">
    var readyFunc = function onBridgeReady() {
        var curid;
        var curAudioId;
        var playStatus = 0;

        // 关闭当前webview窗口 - closeWindow
        document.querySelector('#closeWindow').addEventListener('click', function(e){
            WeixinJSBridge.invoke('closeWindow',{
            },function(res){

                //alert(res.err_msg);

            });
        });
    }

    if (typeof WeixinJSBridge === "undefined") {
        document.addEventListener('WeixinJSBridgeReady', readyFunc, false);
    } else {
        readyFunc();
    }
    // 调起微信客户端的图片播放组件进行播放
    WeixinApi.ready(function(Api){
        var srcList = [];
        $.each($('img'),function(i,item){
           if(item.src) {
               srcList.push(item.src);
               $(item).click(function(e){
                   // 通过这个API就能直接调起微信客户端的图片播放组件了
                   Api.imagePreview(this.src,srcList);
               });
           }
        });
    });
</script>



    <!-- Bootstrap core JavaScript
    ================================================== -->
    <!-- Placed at the end of the document so the pages load faster -->

</body>
</html>
